//
//  LandMarkDetail.swift
//  WorldLandMark
//
//  Created by Felix Hi on 2021/6/28.
//

import SwiftUI

struct LandMarkDetail: View {
    @State private var zoomed = false
    
    let landmark: Landmark
    
    var body: some View {
        ZStack (alignment: .bottomTrailing) {
            Image(systemName: landmark.icon).resizable()
                .aspectRatio(contentMode: zoomed ? .fill : .fit)
                .cornerRadius(8.0)
                .navigationBarTitle(Text(landmark.name), displayMode: .inline)
                .frame(
                    minWidth: 0,
                    maxWidth: .infinity,
                    minHeight: 0,
                    maxHeight: .infinity)
                .onTapGesture {
                    // 统一动画
                    /**
                    withAnimation {
                        self.zoomed.toggle()
                    }
                     */
                    // 自定义动画
                    withAnimation(.linear(duration: 0.1)) {
                        self.zoomed.toggle()
                    }
                }
            if !zoomed {
                Text(landmark.location)
                    .font(.largeTitle)
                    .foregroundColor(.secondary)
                    .padding()
                    .transition(.move(edge: .trailing))
            }
        }
    }
}

struct LandMarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        LandMarkDetail(landmark: landmarks[0])
    }
}
